
// $(".top").on("mouseenter",function(){
//     $(".top").css("backgroundColor","white")
//     $(".top").fadeIn(500);
// });

// $(".top").on("mouseleave",function(){
//     $(".top").css("backgroundColor","transparent")
//     $(".top").fadeOut(500);
// })

// 导航栏在页面滚动时显示和回到顶部后隐藏

window.addEventListener("scroll", function () {

  var scroll = document.querySelector(".top");
  if (
    document.body.scrollTop > 0 ||document.documentElement.scrollTop
  ) {
    scroll.style.backgroundColor = "rgb(255, 255, 255,.9)";
  } else {
    scroll.style.backgroundColor = "transparent";
  }
});

// 图片旋转(没有动画效果)
// var imgPhoto = document.querySelector(".imgPhoto");

// imgPhoto.addEventListener("mouseenter",function(){
//     this.classList.add("rotated");
//     // console.log("生效")
// })

// imgPhoto.addEventListener("mouseleave",function(){
//     this.classList.remove("rotated");
// })

// function Rotated(){
//     var timer = setInterval(
//         clearInterval(timer),
//     )
// }
// Rotated()



// 图片旋转(动画效果)

var imgPhoto = document.querySelector(".imgPhoto");
// 旋转
// var angle = 0;
// var rotateAngle = 3;

// 还原
// var angles = 360;
// var rotateAngles = 3;

// 计时器
// var timer = setInterval(rotate, 10);
var isPlay = false;
imgPhoto.onmouseenter = function() {
  isPlay = true;
    var angle = 0;
    var rotateAngle = 3;

    var timer = clearInterval();
    var timer = setInterval(rotate, 1);
    
        function rotate() {
        
        angle += rotateAngle;

        if (angle <= 360) {
            imgPhoto.style.transform = "rotate(" + angle + "deg)";
        }
    }
    isPlay = false;
    
    // ("imgPhoto").on("mouseenter",$.debounce(1000,onmouseenter))
}

// var delay = null;
// imgPhoto.onmouseenter = function(){
//     if(delay != null)clearTimeout(delay);
//     delay = setTimeout(function(){
//         onmouseenter();
//         delay = null;
//     },300)
// }

imgPhoto.onmouseleave = function(){
  isPlay = true;
    var angles = 360;
    var rotateAngles = 3;

    var timer = clearInterval(); 
    var timer = setInterval(rotates,1);
    
        function rotates(){
        
        angles -= rotateAngles;

        if(angles >=0){
            imgPhoto.style.transform = "rotate(" + angles + "deg)";
            
          }
    }
    isPlay = false;
    // ("imgPhoto").on("mouseleave",$.debounce(1000,onmouseleave))
}

// var delay = null;
// imgPhoto.onmouseleave = function(){
//     if(delay != null)clearTimeout(delay);
//     delay = setTimeout(function(){
//         onmouseleave();
//         delay = null;
//     },300)
// }

// 文字打字效果
// (1)
var input = document.querySelector(".text");
// console.log(input);
var inputText = input.innerHTML;
console.log(inputText);
var counter = 0;

input.innerHTML ="";
setInterval(function(){
    if(counter < inputText.length){
        // input.innerHTML ="";
        input.innerHTML += inputText.charAt(counter);
        counter ++;
    }
},150);

// (2)
// var input = document.querySelector(".text")
// var inputText = input.innerHTML;
// console.log(inputText);
// // var str = '所有接口仅供学习交流使用，不保证实时更新，请勿用于商业项目。如有侵权请联系删除。';
// var end = 0;
// var loop = function(){
//     // input.innerText = "";
//     end ++;
        // 反复循环条件
//     // end = end > inputText.length ? 0 : end;

//     if(end <= inputText.length){
//       var txt = inputText.slice(0,end);
//       input.innerText = txt;
//     }
// }
// clearInterval();
// setInterval(function(){loop()},100)


// 设置图片随页面刷新切换
window.onload = function(){
  var bgPhoto = document.querySelector(".bgPhoto");
  // console.log(bgPhoto);
  var imagesArray = ["./images/beyond_by_auroralion-dan5njb.jpg","./images/s19.jpg","./images/s2.jpg","./images/s4.jpg","./images/s12.jpg","./images/s20.jpg"];
  var randomIndex = Math.floor(Math.random()*imagesArray.length);
  var bgImage = imagesArray[randomIndex];
  // console.log(bgImage)
  bgPhoto.style.backgroundImage = "";
  bgPhoto.style.backgroundImage = "url(' "+ bgImage +" ')";
};

  // 搜索框搜索行为
  // 搜索确认
  var searchbox = document.querySelector('.searchbox');
  // console.log(searchbox);

  var searchboxs = document.querySelector(".searchboxs");
  // console.log(searchboxs);

  searchboxs.addEventListener('keydown',function(event){
    if(event.key === 'Enter' || event.keyCode === 13){
      // event.preventDefault();
      searchbox.style.display = "none";
    }
  });
  // 点击按钮

  $('.search').on("mousedown",function(){
    $('.searchbox').fadeIn(1000);
  })

  $('.delete').on("mousedown",function(){
    // $('.searchbox').css('display','none');
    $('.searchbox').fadeOut(1000);
    // $('.searchbox').slideUp(3000);
  })

  // 设置点击菜单显示隐藏
  var menu = document.querySelector(".menu");
  var deletes = document.querySelector(".deletes");
  var menubox = document.querySelector(".menubox");
  var line1 = document.querySelector(".line")
  var line2 = document.querySelector(".line2")
  var line3 = document.querySelector(".line3")

  menu.addEventListener("click",function(){
    menubox.style.display = "block";
    deletes.style.display = "block";
    line1.style.display = "none";
    line2.style.display = "none";
    line3.style.display = "none";

  })
  deletes.addEventListener("click",function(){
    deletes.style.display = "none"
    menubox.style.display = "none";
    line1.style.display = "block";
    line2.style.display = "block";
    line3.style.display = "block";
  })

  // document.addEventListener("scroll",disableScroll);
  // function disableScroll(){
  //   window.scrollTo(0,0);
  // }

  // 设置响应式缩小后的页面响应式菜单栏
  $(".openbtn").on("click",function(){
    $(".openbtn").css("display","none");
    $(".openbox").css("display","block");
    $(".top").css("display","none");
    $(".opendelete").css("display","block");
    $(".bgPhoto").css("left","250px");
    $(".content").css("left","250px");
    $(".bgPhoto").addClass("mask");
    // 禁止滚动
    $('html,body').css('overflow','hidden');
  })

  $(".opendelete").on("click",function(){
    $(".openbox").css("display","none");
    $(".top").css("display","block");
    $(".opendelete").css("display","none");
    $(".openbtn").css("display","block");
    $(".bgPhoto").css("left","0px");
    $(".content").css("left","0px");
    $(".bgPhoto").removeClass("mask");
    // 解除禁止滚动
    $('html,body').css('overflow','visible');
  });

  // 回到顶部
  $(window).scroll(function(){
    console.log($(this).scrollTop());
    console.log($(this).height());

    if($(this).scrollTop()>=$(this).height()){
      $(".GoTop").fadeIn(500);
    }
    else{
      $(".GoTop").fadeOut(500);
    }
  })

  $(".GoTop").click(function(){
    $("body,html").animate({
      scrollTop:0
    },500)
  })